<template>
	<div class="Eva_body">
		<div class="Eva_nva">
			<div>
				<router-link to="/mobile/booklist">
					<p>返回</p>
				</router-link>
			</div>
			<div>
				<p>商品</p>
			</div>
			<div>
				<p>详情</p>
			</div>
			<div>
				<p>评论 </p>
			</div>
			<div>
				<p>推荐</p>
			</div>
		</div>
		<hr style="width: 100%;" />
		<div class="Eva_list">
			<div v-for=" item in list">
				<div style="display: flex;">
					<div><img :src="`http://127.0.0.1/api/public/showimg/${item.img}`" /> </div>
					<div style="padding: 15px;"> {{item.nickname}}</div>
					<div>
						<el-rate v-model="item.rate" disabled show-score text-color="#ff9900" score-template="{value}">
						</el-rate>
					</div>
				</div>
				<div style="margin-top: 5%;">
					{{item.content}}
				</div>

				<div style="margin-top: 5%;">{{item.tpost}}</div>
				<hr style="width: 100%;" />
			</div>
		</div>
	</div>
</template>

<script>
	export default {

		data() {
			return {
				ratevalue:4,
				list: []
			}
		},
		methods: {
			getAllCrit() {
				let url = this.$route.fullPath.split('/')[3];
				this.$get("/api/public/rate/findByBookid/" + url + "/1/6").then((resp) => {
					this.list = resp.data.data.comments
					this.list.forEach((item) => {
						let date = new Date(item.tpost)
						item.tpost = date.getFullYear() + '年' + date.getMonth() + '月' + date.getDay() + '日'
					})
					console.log(resp.data.data)
				})
			}
		},
		mounted() {

			this.getAllCrit()
		}
	}
</script>

<style>
	.Eva_nva {
		width: 100%;
		display: flex;
	}

	.Eva_nva p {
		font-size: 25px;
	}

	.Eva_nva div {
		margin-left: 20px;
	}

	.Eva_body {
		margin: 0;
		padding: 0;
		width: 100%;
	}

	.Eva_list {
		width: 100%;
	}

	.Eva_list img {
		width: 50%;
		margin-left: 10%;
		border-radius: 100px;
	}
</style>
